
page-mine-more
{
  .mine-work-header
  {
    @include office-header-style;
    .toolbar-background
    {
      @include office-background();
    }
  }

  // 个人信息展示
  .mine-work-section
  {

    .scroll-content
    {
      background-color: $office-page-background;

      // 提示头部
      .work-title
      {
        padding-left: px2rem(32);
        height: px2rem(60);
        line-height: px2rem(60);
        font-size: px2rem(24);
        color: $office-light-black-nine;
      }

      @mixin common-wrapper-style
      {
        height: px2rem(87);
        ion-label
        {
          margin: 0;
          div, input, h3, p
          {
            float: left;
            height: px2rem(88);
            line-height: px2rem(88);
          }
          & > div
          {
            text-align: left;
            width: px2rem(190);
            font-size: px2rem(30);
            color: $office-black;
          }

          // 姓名
          & > input
          {
            margin-top: px2rem(15);
            width: px2rem(430);
            height: px2rem(58);
            outline: none;
            color: $office-light-black-six;
            background-color: transparent;
            border: 0;
            font-size: px2rem(28);
            &.add-margin-left{margin-left: px2rem(190);}
          }
          // 姓名
          & > p
          {
            width: px2rem(420);
            color: $office-light-black-six;
            @include office-single-ellipsis;
            font-size: px2rem(28);
          }
          h3
          {
            margin: 0;
            padding: 0;
            @extend div;
            color: $office-light-black-six;
          }

        }
      }
      // 内容条目
      ion-list
      {
        padding: 0;
        margin: 0 0 px2rem(35) 0;

        // 纯展示部分
        ion-item
        {
          //border: 0 !important;
          padding-left: px2rem(32);

          div.item-inner
          {
            border: 0;
            padding-right: px2rem(32) !important;

            // 左边
            div.input-wrapper
            {
              @include common-wrapper-style;
            }


          }
          // 增加margin
          &:nth-child(2), &:nth-child(4){
            margin-bottom: px2rem(20);
            border-bottom: 1px solid $office-ion-item-border-color;
            div.item-inner
            {
              border-top: 1px solid $office-ion-item-border-color;
            }
          }
          &:nth-child(1){
            border-top: 1px solid $office-ion-item-border-color;
          }

        }

        // 有箭头部分
        a.item
        {
          padding-left: px2rem(32);
          height: px2rem(88);
          border: 0;

          div.item-inner
          {
            padding-right : px2rem(49) !important;
            border: 0;
            background: url("../assets/img/common/arrows-right.png") no-repeat right px2rem(32) center !important;
            background-size: px2rem(17) px2rem(29) !important;
            // 左边
            div.input-wrapper
            {
              @include common-wrapper-style;
            }
          }

          &:nth-child(1)
          {
            border-top: 1px solid $office-ion-item-border-color;
            div.item-inner
            {
              border-bottom: 1px solid $office-ion-item-border-color;
            }
          }
          &:nth-child(2)
          {
            border-bottom: 1px solid $office-ion-item-border-color;
          }
        }

        // picker样式
        .arrows-right
        {
          @include office-picker-style;
          // 内容展示区
          .input-wrapper
          {
            display: block;
            ion-label
            {
              height: px2rem(88);
              line-height: px2rem(88);
              float: left;
              width: px2rem(190);
            }
            ion-datetime,ion-multi-picker
            {
              div
              {
                line-height: px2rem(88);
              }
            }


          }
        }

      }

    }
  }

  // 底部
  .mine-work-footer
  {
    height: px2rem(98);
    bottom: 0 !important;
    button
    {
      @include office-background();
      @include office-footer-button-style(100%);
      @include office-button-disable();
    }
  }

}
